<!doctype html>
<html>

  <head>
    <meta charset="utf-8">
    <title>选择人员</title>
    <meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
    <link href="../../../css/mui.min.css" rel="stylesheet" />
    <link href="../css/common.css" rel="stylesheet" />
    <style type="text/css">
      body {
        background: #FFFFFF;
      }
      .list-item{
        padding: 15px;
        display: flex;
        justify-content: space-between;
      }
      .active{
        background: #F1F3F7;
        color: #3188FE;
      }
      .dui{
        opacity: 0;
      }
      .active .dui{
        opacity: 1;
      }
    </style>
  </head>

  <body>
    <header class="mui-bar mui-bar-nav">
      <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
      <h1 class="mui-title">选择人员</h1>
    </header>
    <div class="mui-content bg-white page-wrap" id="container">
      <div class="page-scroll">
        <div :class="['list-item border-bottom', i === checkedIndex? 'active':'']" v-for="(item, i) in list" :key="i" @click="choose(i)">
        	{{item.un}}
        	<img class="dui" src="../img/xuanzerenyuan_duigou.png" width="20" height="20"/>
        </div>
      </div>
      <div class="fixed-btn">
        <button type="button" class="mui-btn mui-btn-primary" @click="sure">确认</button>
      </div>
    </div>
    <script type="text/javascript" src="../../../js/mui.js"></script>
    <script src="../js/mkeyplus.base.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript" src="../../../js/jquery-3.2.1.min.js"></script>
    <script src="../../../js/vue.js" type="text/javascript" charset="utf-8"></script>
    <script type="text/javascript">
      mui.init()
      let self // 当前页面
      if(window.plus) {
        plusready();
      } else {
        document.addEventListener('plusready', plusready, false);
      }

      function plusready() {
        self = plus.webview.currentWebview();
        console.log(self.projectTaskId)
        vm.projectTaskId = self.projectTaskId
        vm.getDetail()
      }
      
      let vm = new Vue({
        el: '#container',
        data: {
          projectTaskId: '',
          list: [],
          checkedIndex:null
        },
        methods: {
          getDetail() {
            this.projectTaskWpId ? this.form.projectTaskWpId = projectTaskWpId: ''
            plus.nativeUI.showWaiting('加载中')
            mui.baseApp.httpRequst('get', '/app/api/task/user', {projectTaskId: this.projectTaskId}, (res) => {
              console.log(res)
              this.list = res
              plus.nativeUI.closeWaiting()
            })
          },
          choose(i) {
            this.checkedIndex = i
          },
          sure() {
            if(!this.checkedIndex && this.checkedIndex !== 0) {
              mui.toast("请选择");
              return
            }
            mui.fire(self.opener(), 'person', this.list[this.checkedIndex])
            mui.back()
          }
        }
      })
    </script>
  </body>

</html>